<template>
  <Dialog title="同步" v-model="dialogVis" width="1400px">
    <div>
      <el-table
        v-loading="loading"
        :data="list"
        ref="treeTableRef"
        row-key="id"
        height="500"
        show-overflow-tooltip
        border
        @selection-change="selectChange"
      >
        <el-table-column type="selection" width="55" />
        <el-table-column type="index" width="80" label="序号" align="center" />
        <el-table-column prop="name" label="指纹名称" align="center" />
        <el-table-column
          label="文件指纹"
          align="center"
          :formatter="(row) => renderFinger({ row })"
        />
        <el-table-column prop="deptName" label="归属机构" align="center" />
        <el-table-column prop="systemName" label="归属系统" align="center" />
        <el-table-column prop="standardName" label="数据保护标准" align="center" />
        <el-table-column
          prop="classification"
          label="分类"
          align="center"
          :formatter="(row) => renderClassification({ row })"
        />
        <el-table-column
          prop="level"
          label="分级"
          align="center"
          :formatter="(row) => renderLevel({ row })"
        />
        <el-table-column prop="updateTime" width="300" label="更新时间" align="center" />
      </el-table>
    </div>
    <template #footer>
      <div class="footer-wrap">
        <div>
          <el-button @click="dialogVis = false">关 闭</el-button>
          <el-button type="primary" @click="confirmAllSync">全部同步</el-button>
          <el-button type="primary" @click="confirmSync">同 步</el-button>
        </div>
      </div>
    </template>
  </Dialog>
</template>
<script setup>
import { getSyncList, saveSync } from '@/api/develop/featureLibrary/fingerprint'
import { renderFinger, renderClassification, renderLevel } from '@/utils/commonRender'

const dialogVis = ref(false)
const open = async () => {
  dialogVis.value = true
  await getList()
}
defineExpose({
  open
})

const loading = ref(false)
const list = ref([{}])
const treeTableRef = ref()
const getList = async () => {
  loading.value = true
  try {
    const res = await getSyncList()
    list.value = res
  } finally {
    loading.value = false
  }
}

const emit = defineEmits(['success'])
const confirmSync = async () => {
  const checkedRows = treeTableRef.value.getSelectionRows()
  if (checkedRows.length === 0) {
    return ElMessage.warning('请选择数据')
  }
  const ids = checkedRows.map((item) => item.id)
  await saveSync(ids)
  dialogVis.value = false
  emit('success')
}
const confirmAllSync = async () => {
  if (list.value.length === 0) {
    return
  }
  const ids = list.value.map((item) => item.id)
  await saveSync(ids)
  dialogVis.value = false
  emit('success')
}
</script>
<style lang="scss" scoped>
.footer-wrap {
  display: flex;
  justify-content: end;
}
</style>
